<template class="footer-file-template">
    <div class="footer-root flex gap-4 items-center justify-between max-w-2xl mx-auto" style="align-items: center;">
        <form class="flex flex-col justify-center items-stretch gap-2 w-full w-full max-w-2xl mx-auto">
            <div class="footer-input-root flex gap-3 items-start p-2 rounded-md bg-dark-elements flex-wrap hidden"></div>
            <p class="footer-notification font-light text-m-mobile lg:text-m text-danger-primary hidden"></p>
            <div class="lg:text-regular text-regular-mobile flex gap-4 items-center justify-between">
                <div class="footer-input w-full flex gap-2 items-center leading-4">
                    <label class="group flex flex-row gap-2 cursor-pointer opacity-60 hover:opacity-100" for="file-input"></label>
                </div>
                <div class="flex items-center gap-2 ">
                    <div class="footer-toggle group relative hidden">
                        <div class="footer-toggle-title absolute p-2 hidden group-hover:flex items-start gap-1 bottom-full left-1/2 -translate-x-1/2 -translate-y-3.5 bg-dark-elements-hover rounded-md w-[265px] text-m-mobile lg:text-m"></div>
                        <div class="flex items-center gap-2">
                            <div class="appearance-none flex items-center gap-2">
                                <div class="dotlottie-container main  w-5 h-5" lang="en">
                                    <div data-name="undefined" role="figure" class="animation footer-toggle-icon" style="position: relative; width: 100%; height: 100%; background-color: transparent;"></div>
                                </div>
                                <span style="text-wrap: nowrap;" class="max-md:hidden footer-toggle-name"></span>
                            </div>
                            <div>
                                <label class="flex items-center cursor-pointer">
                                    <div class="relative">
                                        <input class="sr-only" type="checkbox" onchange="toggleLogical(this);">
                                        <div class="w-8 h-5 rounded-full transition-colors bg-dark-elements"></div>
                                        <div class="w-4 h-4 absolute left-0.5 top-0.5 rounded-full transition translate-x-0 bg-accent-primary"></div>
                                    </div>
                                </label>
                            </div>
                        </div>
                    </div>
                    <span class="hidden w-px h-5 rounded bg-white bg-opacity-[.15] shrink-0"></span>
                    <div class="relative flex gap-2 items-center">
                        <div class="footer-meta-button relative flex gap-2 items-center hidden">
                            <button class="relative px-2 py-2.5 lg:px-2.5 transition-opacity" type="button">
                                <div class="description-button group relative hidden-on-touchscreen">
                                    <svg width="20px" height="20px" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M18.1716 1C18.702 1 19.2107 1.21071 19.5858 1.58579L22.4142 4.41421C22.7893 4.78929 23 5.29799 23 5.82843V20C23 21.6569 21.6569 23 20 23H4C2.34315 23 1 21.6569 1 20V4C1 2.34315 2.34315 1 4 1H18.1716ZM4 3C3.44772 3 3 3.44772 3 4V20C3 20.5523 3.44772 21 4 21L5 21L5 15C5 13.3431 6.34315 12 8 12L16 12C17.6569 12 19 13.3431 19 15V21H20C20.5523 21 21 20.5523 21 20V6.82843C21 6.29799 20.7893 5.78929 20.4142 5.41421L18.5858 3.58579C18.2107 3.21071 17.702 3 17.1716 3H17V5C17 6.65685 15.6569 8 14 8H10C8.34315 8 7 6.65685 7 5V3H4ZM17 21V15C17 14.4477 16.5523 14 16 14L8 14C7.44772 14 7 14.4477 7 15L7 21L17 21ZM9 3H15V5C15 5.55228 14.5523 6 14 6H10C9.44772 6 9 5.55228 9 5V3Z" fill="white"/></svg>
                                    <div class="bg-dark-pop-up bg-opacity-50 backdrop-blur-2xl absolute bottom-full -translate-y-1 left-1/2 -translate-x-1/2 lg:text-s text-s-mobile px-1.5 py-1 rounded-md after:absolute after:top-full after:left-1/2 after:-translate-x-1/2 after:border-t-[5px] after:border-x-[3px] after:border-x-transparent after:border-t-dark-elements hidden hidden-on-touchscreen group-hover:block whitespace-nowrap">{{ _('Save options') }}</div>
                                </div>
                                <div class="group relative block-on-touchscreen hidden">
                                    <svg width="20px" height="20px" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M18.1716 1C18.702 1 19.2107 1.21071 19.5858 1.58579L22.4142 4.41421C22.7893 4.78929 23 5.29799 23 5.82843V20C23 21.6569 21.6569 23 20 23H4C2.34315 23 1 21.6569 1 20V4C1 2.34315 2.34315 1 4 1H18.1716ZM4 3C3.44772 3 3 3.44772 3 4V20C3 20.5523 3.44772 21 4 21L5 21L5 15C5 13.3431 6.34315 12 8 12L16 12C17.6569 12 19 13.3431 19 15V21H20C20.5523 21 21 20.5523 21 20V6.82843C21 6.29799 20.7893 5.78929 20.4142 5.41421L18.5858 3.58579C18.2107 3.21071 17.702 3 17.1716 3H17V5C17 6.65685 15.6569 8 14 8H10C8.34315 8 7 6.65685 7 5V3H4ZM17 21V15C17 14.4477 16.5523 14 16 14L8 14C7.44772 14 7 14.4477 7 15L7 21L17 21ZM9 3H15V5C15 5.55228 14.5523 6 14 6H10C9.44772 6 9 5.55228 9 5V3Z" fill="white"/></svg>
                                    <div class="bg-dark-pop-up bg-opacity-50 backdrop-blur-2xl absolute bottom-full -translate-y-1 left-1/2 -translate-x-1/2 lg:text-s text-s-mobile px-1.5 py-1 rounded-md after:absolute after:top-full after:left-1/2 after:-translate-x-1/2 after:border-t-[5px] after:border-x-[3px] after:border-x-transparent after:border-t-dark-elements whitespace-nowrap hidden">{{ _('Save options') }}</div>
                                </div>
                                <span class="h-px w-5 rounded bg-white absolute left-1/2 bottom-0 -translate-x-1/2 transition-opacity opacity-0"></span>
                            </button>
                            <span class="hidden w-px h-5 rounded bg-white bg-opacity-[.15]"></span>
                        </div>
                        <div class="footer-motion-button relative flex gap-2 items-center hidden">
                            <button class="relative px-2 py-2.5 lg:px-2.5 transition-opacity" type="button">
                                <div class="description-button group relative hidden-on-touchscreen">
                                    <svg style="fill: white;" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"  width="20px" height="20px" viewBox="0 0 512 512"  xml:space="preserve"><g><path d="M90.734,210.977c22.547,0.016,43.172-9.203,57.922-24c14.781-14.734,24-35.359,24-57.906 s-9.219-43.188-24-57.938c-14.75-14.781-35.375-24-57.922-23.984c-22.547-0.016-43.172,9.203-57.922,24 c-14.781,14.734-24,35.375-23.984,57.922c-0.016,22.547,9.203,43.156,23.984,57.906C47.563,201.773,68.188,210.992,90.734,210.977z M66.109,104.43c6.375-6.344,14.938-10.188,24.625-10.203c9.703,0.016,18.25,3.859,24.641,10.203 c6.328,6.375,10.188,14.938,10.188,24.641c0,9.688-3.859,18.234-10.188,24.625c-6.391,6.328-14.938,10.188-24.641,10.203 c-9.688-0.016-18.25-3.875-24.625-10.203c-6.344-6.391-10.188-14.938-10.203-24.625C55.922,119.367,59.766,110.805,66.109,104.43z"/><path d="M270.219,210.977c22.547,0.016,43.172-9.203,57.922-24c14.781-14.75,24-35.359,23.984-57.906 c0.016-22.547-9.203-43.188-23.984-57.922c-14.75-14.797-35.375-24.016-57.922-24c-22.531-0.016-43.172,9.203-57.922,23.984 c-14.797,14.75-24,35.391-23.984,57.938c-0.016,22.547,9.203,43.172,23.984,57.906 C227.047,201.773,247.688,210.992,270.219,210.977z M245.594,104.43c6.375-6.344,14.938-10.188,24.625-10.203 c9.688,0.016,18.25,3.859,24.625,10.203c6.344,6.375,10.188,14.938,10.203,24.641c-0.016,9.688-3.859,18.234-10.203,24.625 c-6.375,6.328-14.938,10.188-24.625,10.203c-9.688-0.016-18.25-3.875-24.625-10.203c-6.344-6.391-10.188-14.938-10.203-24.625 C235.406,119.367,239.25,110.805,245.594,104.43z"/><path d="M313.047,224.195H45.953c-12.625-0.016-24.234,5.172-32.5,13.453C5.172,245.914,0,257.523,0,270.148v148.75 c0,12.625,5.172,24.25,13.453,32.5c8.266,8.281,19.875,13.469,32.5,13.453h267.094c12.609,0.016,24.234-5.172,32.484-13.453 c8.297-8.25,13.484-19.875,13.469-32.5v-148.75c0.016-12.625-5.172-24.234-13.469-32.5 C337.281,229.367,325.656,224.18,313.047,224.195z M317.813,418.898c-0.031,1.391-0.516,2.453-1.406,3.375 c-0.922,0.891-1.984,1.375-3.359,1.391H45.953c-1.391-0.016-2.438-0.5-3.359-1.391c-0.891-0.922-1.375-1.984-1.406-3.375v-148.75 c0.031-1.375,0.516-2.438,1.406-3.375c0.922-0.875,1.969-1.375,3.359-1.391h267.094c1.375,0.016,2.438,0.516,3.359,1.391 c0.891,0.938,1.375,2,1.406,3.375V418.898z"/><path d="M493.875,236.414c-5.828-3.516-12.531-5.359-19.125-5.359c-6.063,0-12.063,1.484-17.609,4.422l-73.734,39.313 v46.719l87.406-46.594v139.297l-87.406-46.672v46.734l73.734,39.297c5.547,2.953,11.547,4.422,17.609,4.422  c6.594,0,13.297-1.766,19.188-5.297C505.125,445.93,512,433.805,512,420.68V268.367C512,255.242,505.125,243.117,493.875,236.414z"/></g></svg>
                                    <div class="bg-dark-pop-up bg-opacity-50 backdrop-blur-2xl absolute bottom-full -translate-y-1 left-1/2 -translate-x-1/2 lg:text-s text-s-mobile px-1.5 py-1 rounded-md after:absolute after:top-full after:left-1/2 after:-translate-x-1/2 after:border-t-[5px] after:border-x-[3px] after:border-x-transparent after:border-t-dark-elements hidden hidden-on-touchscreen group-hover:block whitespace-nowrap">{{ _('Motion control') }}</div>
                                </div>
                                <div class="group relative block-on-touchscreen hidden">
                                    <svg style="fill: white;" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"  width="20px" height="20px" viewBox="0 0 512 512"  xml:space="preserve"><g><path d="M90.734,210.977c22.547,0.016,43.172-9.203,57.922-24c14.781-14.734,24-35.359,24-57.906 s-9.219-43.188-24-57.938c-14.75-14.781-35.375-24-57.922-23.984c-22.547-0.016-43.172,9.203-57.922,24 c-14.781,14.734-24,35.375-23.984,57.922c-0.016,22.547,9.203,43.156,23.984,57.906C47.563,201.773,68.188,210.992,90.734,210.977z M66.109,104.43c6.375-6.344,14.938-10.188,24.625-10.203c9.703,0.016,18.25,3.859,24.641,10.203 c6.328,6.375,10.188,14.938,10.188,24.641c0,9.688-3.859,18.234-10.188,24.625c-6.391,6.328-14.938,10.188-24.641,10.203 c-9.688-0.016-18.25-3.875-24.625-10.203c-6.344-6.391-10.188-14.938-10.203-24.625C55.922,119.367,59.766,110.805,66.109,104.43z"/><path d="M270.219,210.977c22.547,0.016,43.172-9.203,57.922-24c14.781-14.75,24-35.359,23.984-57.906 c0.016-22.547-9.203-43.188-23.984-57.922c-14.75-14.797-35.375-24.016-57.922-24c-22.531-0.016-43.172,9.203-57.922,23.984 c-14.797,14.75-24,35.391-23.984,57.938c-0.016,22.547,9.203,43.172,23.984,57.906 C227.047,201.773,247.688,210.992,270.219,210.977z M245.594,104.43c6.375-6.344,14.938-10.188,24.625-10.203 c9.688,0.016,18.25,3.859,24.625,10.203c6.344,6.375,10.188,14.938,10.203,24.641c-0.016,9.688-3.859,18.234-10.203,24.625 c-6.375,6.328-14.938,10.188-24.625,10.203c-9.688-0.016-18.25-3.875-24.625-10.203c-6.344-6.391-10.188-14.938-10.203-24.625 C235.406,119.367,239.25,110.805,245.594,104.43z"/><path d="M313.047,224.195H45.953c-12.625-0.016-24.234,5.172-32.5,13.453C5.172,245.914,0,257.523,0,270.148v148.75 c0,12.625,5.172,24.25,13.453,32.5c8.266,8.281,19.875,13.469,32.5,13.453h267.094c12.609,0.016,24.234-5.172,32.484-13.453 c8.297-8.25,13.484-19.875,13.469-32.5v-148.75c0.016-12.625-5.172-24.234-13.469-32.5 C337.281,229.367,325.656,224.18,313.047,224.195z M317.813,418.898c-0.031,1.391-0.516,2.453-1.406,3.375 c-0.922,0.891-1.984,1.375-3.359,1.391H45.953c-1.391-0.016-2.438-0.5-3.359-1.391c-0.891-0.922-1.375-1.984-1.406-3.375v-148.75 c0.031-1.375,0.516-2.438,1.406-3.375c0.922-0.875,1.969-1.375,3.359-1.391h267.094c1.375,0.016,2.438,0.516,3.359,1.391 c0.891,0.938,1.375,2,1.406,3.375V418.898z"/><path d="M493.875,236.414c-5.828-3.516-12.531-5.359-19.125-5.359c-6.063,0-12.063,1.484-17.609,4.422l-73.734,39.313 v46.719l87.406-46.594v139.297l-87.406-46.672v46.734l73.734,39.297c5.547,2.953,11.547,4.422,17.609,4.422  c6.594,0,13.297-1.766,19.188-5.297C505.125,445.93,512,433.805,512,420.68V268.367C512,255.242,505.125,243.117,493.875,236.414z"/></g></svg>
                                    <div class="bg-dark-pop-up bg-opacity-50 backdrop-blur-2xl absolute bottom-full -translate-y-1 left-1/2 -translate-x-1/2 lg:text-s text-s-mobile px-1.5 py-1 rounded-md after:absolute after:top-full after:left-1/2 after:-translate-x-1/2 after:border-t-[5px] after:border-x-[3px] after:border-x-transparent after:border-t-dark-elements whitespace-nowrap hidden">{{ _('Motion control') }}</div>
                                </div>
                                <span class="h-px w-5 rounded bg-white absolute left-1/2 bottom-0 -translate-x-1/2 transition-opacity opacity-0"></span>
                            </button>
                            <span class="hidden w-px h-5 rounded bg-white bg-opacity-[.15]"></span>
                        </div>
                        <div class="footer-parameters-button relative flex gap-2 items-center hidden">
                            <button class="relative px-2 py-2.5 lg:px-2.5 transition-opacity opacity-60 hover:opacity-100" type="button">
                                <div class="description-button group relative hidden-on-touchscreen">
                                    <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="isolation:isolate" viewBox="0 0 20 20" width="20px" height="20px"><defs><clipPath id="_clipPath_1acnWE7Y7DrsLCoMVgXqpW5bzmBv6p5y"><rect width="20" height="20"/></clipPath></defs><g clip-path="url(#_clipPath_1acnWE7Y7DrsLCoMVgXqpW5bzmBv6p5y)"><rect x="3" y="3" width="5.333" height="5.333" transform="matrix(1,0,0,1,0,0)" fill="none" vector-effect="non-scaling-stroke" stroke-width="1.5" stroke="rgb(255,255,255)" stroke-linejoin="round" stroke-linecap="round" stroke-miterlimit="2"/><rect x="11.333" y="11.333" width="5.333" height="5.333" transform="matrix(1,0,0,1,0,0)" fill="none" vector-effect="non-scaling-stroke" stroke-width="1.5" stroke="rgb(255,255,255)" stroke-linejoin="round" stroke-linecap="round" stroke-miterlimit="2"/><line x1="17" y1="5.667" x2="8.333" y2="5.667" vector-effect="non-scaling-stroke" stroke-width="1" stroke="rgb(255,255,255)" stroke-linejoin="miter" stroke-linecap="square" stroke-miterlimit="3"/><line x1="11.281" y1="14.167" x2="4" y2="14.167" vector-effect="non-scaling-stroke" stroke-width="1" stroke="rgb(255,255,255)" stroke-linejoin="miter" stroke-linecap="square" stroke-miterlimit="3"/></g></svg>
                                    <div class="bg-dark-pop-up bg-opacity-50 backdrop-blur-2xl absolute bottom-full -translate-y-1 left-1/2 -translate-x-1/2 lg:text-s text-s-mobile px-1.5 py-1 rounded-md after:absolute after:top-full after:left-1/2 after:-translate-x-1/2 after:border-t-[5px] after:border-x-[3px] after:border-x-transparent after:border-t-dark-elements hidden hidden-on-touchscreen group-hover:block whitespace-nowrap">{{ _('Parameters') }}</div>
                                </div>
                                <div class="group relative block-on-touchscreen hidden">
                                    <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="isolation:isolate" viewBox="0 0 20 20" width="20px" height="20px"><defs><clipPath id="_clipPath_1acnWE7Y7DrsLCoMVgXqpW5bzmBv6p5y"><rect width="20" height="20"/></clipPath></defs><g clip-path="url(#_clipPath_1acnWE7Y7DrsLCoMVgXqpW5bzmBv6p5y)"><rect x="3" y="3" width="5.333" height="5.333" transform="matrix(1,0,0,1,0,0)" fill="none" vector-effect="non-scaling-stroke" stroke-width="1.5" stroke="rgb(255,255,255)" stroke-linejoin="round" stroke-linecap="round" stroke-miterlimit="2"/><rect x="11.333" y="11.333" width="5.333" height="5.333" transform="matrix(1,0,0,1,0,0)" fill="none" vector-effect="non-scaling-stroke" stroke-width="1.5" stroke="rgb(255,255,255)" stroke-linejoin="round" stroke-linecap="round" stroke-miterlimit="2"/><line x1="17" y1="5.667" x2="8.333" y2="5.667" vector-effect="non-scaling-stroke" stroke-width="1" stroke="rgb(255,255,255)" stroke-linejoin="miter" stroke-linecap="square" stroke-miterlimit="3"/><line x1="11.281" y1="14.167" x2="4" y2="14.167" vector-effect="non-scaling-stroke" stroke-width="1" stroke="rgb(255,255,255)" stroke-linejoin="miter" stroke-linecap="square" stroke-miterlimit="3"/></g></svg>
                                    <div class="bg-dark-pop-up bg-opacity-50 backdrop-blur-2xl absolute bottom-full -translate-y-1 left-1/2 -translate-x-1/2 lg:text-s text-s-mobile px-1.5 py-1 rounded-md after:absolute after:top-full after:left-1/2 after:-translate-x-1/2 after:border-t-[5px] after:border-x-[3px] after:border-x-transparent after:border-t-dark-elements whitespace-nowrap hidden">{{ _('Parameters') }}</div>
                                </div>
                                <span class="h-px w-5 rounded bg-white absolute left-1/2 bottom-0 -translate-x-1/2 transition-opacity opacity-0"></span>
                            </button>
                        </div>
                        <div class="footer-parameters absolute z-[3] right-0 bottom-full rounded-[.625rem] bg-dark-pop-up shadow-tooltip w-[17.5rem] pl-4 pr-2 pb-4 pt-8 hidden">
                            <button class="footer-parameters-close absolute top-2 right-2" type="button">
                                <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="none" stroke="white"><path d="M15 5L5 15M5 5L15 15" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path></svg>
                            </button>
                            <div class="mt-3 flex flex-col gap-5 overflow-auto transition-[height_max-height] pr-2" style="max-height: calc(933px - var(--navbar-height) - 60px);"></div>
                        </div>
                    </div>
                    <button disabled type="button" class="footer-submit rounded-md flex items-center justify-center transition-colors font-normal disabled:cursor-not-allowed px-1.5 gap-1.5 py-1.5 bg-light-emphasis hover:bg-dark-elements-hover text-light-primary bg-dark-elements fill-white opacity-20">
                        <svg class="paper" width="20px" height="20px" viewBox="0 0 256 256" xmlns="http://www.w3.org/2000/svg"><path d="M231.626,128a16.015,16.015,0,0,1-8.18262,13.96094L54.53027,236.55273a15.87654,15.87654,0,0,1-18.14648-1.74023,15.87132,15.87132,0,0,1-4.74024-17.60156L60.64746,136H136a8,8,0,0,0,0-16H60.64746L31.64355,38.78906A16.00042,16.00042,0,0,1,54.5293,19.44727l168.915,94.59179A16.01613,16.01613,0,0,1,231.626,128Z"></path></svg>
                    </button>
                </div>
            </div>
        </form>
    </div>
</template>
